<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>login</title>
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<link rel="stylesheet" type="text/css" href="css/login.css" />
		<link rel="stylesheet" type="text/css" href="css/box.css" />
		<script src="js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery.simplemodal.js" type="text/javascript"></script>

		<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
		<link rel="stylesheet" href="/resources/demos/style.css">
		<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

		<script>
			$(function() {
				$(document).tooltip();
			});
		</script>
	</head>

	<body>
		<div id="loginDiv">
			<form action="" id="commentForm">
				<h1 style="text-align: center;color: aliceblue;">LOGIN IN</h1>
				<p>用户名:
					<input id="userNname" type="text" title="至少两个字符">
				</p>

				<p>密&nbsp;&nbsp;码:
					<input id="password" type="password" title="必须包含字母和数字">
				</p>

				<div style="text-align: center;margin-top: 30px;">
					<input type="submit" class="button" value="登录" id="btnSubmit">
					<input type="reset" class="button" value="重置">
				</div>
			</form>
		</div>
	</body>

	<!-- 创建弹出框层 -->
	<div id="basic-dialog-ok">
		<div class="box-title show">
			<h2>提示</h2>
		</div>
		<div class="box-main">
			<div class="tips">
				<span class="tips-ico">
					<span class="ico-ok">
						<!-- 图标 -->
					</span>
				</span>
				<div class="tips-content">
					<div class="tips-title" id="jnDialogContent"></div>
					<div class="tips-line"></div>
				</div>
			</div>
			<div class="box-buttons"><button type="button" class="simplemodal-close">关 闭</button></div>
		</div>
	</div>


	<!-- 创建JS脚本调用 -->
	<script type="text/javascript">
		//提交确认
		$("#btnSubmit").click(function() {
			$("#jnDialogContent").html("");
			var dialog = "请确认您输入的账号信息。<div style='font-size:12px;font-weight:400;margin-top: 16px;'>用户名是:";
			dialog += $("#userNname").val();
			dialog += "，密码是：" + $("#password").val() + "</div>";
			$("#jnDialogContent").append(dialog);
			$('#basic-dialog-ok').modal();
			return false;
		})
	</script>
</html>
